<template>
	<radio-group
	class="van-radio-group"
	:value="val"
	:disabled="disabled"
	@change="handleChange">
		<slot :value="val"></slot>
	</radio-group>
</template>

<script setup>
import {ref, onMounted, watch, computed, getCurrentInstance, provide} from 'vue';
const emit = defineEmits(["update:modelValue"])
const props = defineProps({
  modelValue: [String, Number, Array, Boolean, Object],
  disabled: {
    type: Boolean,
    default: false
  }
})
// console.log(`=>(van-radio-group.vue:15) props`, props);
const val = ref('')
// console.log(`=>(van-radio-group.vue:23) val`, val);
watch(()=>val.value, (n)=>{
  emit('update:modelValue', n)
})
watch(()=>props.modelValue, (n)=>{
  val.value = n
})
provide('radioGroup', {value: props.modelValue, disabled: props.disabled})
const handleChange = (e) => {
  val.value = e.detail.value
}
</script>

<style lang="scss" scoped>
	.van-radio-group{
	}
</style>